<!DOCTYPE html>
<html>
<head>
    {include file='public/meta'/}

    <link rel="stylesheet" type="text/css" href="__STATIC_URL__/static/css/bootstrapSwitch.css"/>

    <script src="__STATIC_URL__/static/js/bootstrapSwitch.js" type="text/javascript" charset="utf-8"></script>

    <style>
        tbody td {
            text-align: center;
            vertical-align: middle !important;
        }
    </style>
</head>
<body>
{include file='public/header'/}
<section>
    <!------------------导航-------------------------->
    {include file='public/left'/}
    <!--------------------------主要内容区域------------------------------------->
    <div class="content">
        <div class="page-heading mgr15 mgl15">
            <ul class="breadcrumb">
                <li>当前位置是&nbsp;:</li>
                <li>
                    <a href="javascript:;">员工管理</a>
                </li>
                <li class="active" style="color: #02b87f;"> 员工列表</li>
            </ul>
        </div>
        <div class="panel panel-default panel-search mgr15 mgl15">
            <div class="panel-heading">
                <h3 class="panel-title">
                    <span class="glyphicon glyphicon-search pull-left" style="margin-right: 10px;"></span>人员查找
                </h3>
            </div>
            <div class="panel-body">
                <form action="" method="get" class="form-horizontal table-search form-search" role="form" id="machform">
                    <div class="col-xs-12 col-sm-6 col-md-6 col-lg-4 ">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">姓名：</label>
                            <div class="col-sm-9">
                                <input type="text" autocomplete="off" disableautocomplete class="form-control"
                                       placeholder="请输入姓名" value="{$p_data['xingming']}" name="xingming">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="panel-footer">
                <a href="javascript:;" class="btn btn-primary" onclick="searchform()">查找</a>
                <a href="javascript:;" class="btn btn-default" onclick="clearform()">清空</a>
            </div>
        </div>
        <div class="panel mgl15 mgr15">
            <div class="panel-heading addCharts" style="background:#ededed;">员工列表
                {if condition="checkPath('personnel/cashieradd')"}
                <a class="btn btn-info pull-right" href="{:url('Personnel/cashieradd')}"
                   style="margin-top: -7px;">添加新员工</a>
                {/if}
            </div>
            <div class="panel-body">
                <table class="table table-bordered">
                    <thead>
                    <tr>
                        <th class="text-center">姓名</th>
                        <th class="text-center">帐号</th>
                        <th class="text-center">工号</th>
                        <th class="text-center">手机号</th>
                        <th class="text-center">微信</th>
                        <th class="text-center">角色</th>
                        <th class="text-center">所属门店</th>
                        <th class="hidden-phone text-center">操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    {volist name="list" id="vo"}

                    <tr>
                        <td>{$vo.xingming}</td>
                        <td>{$vo.username}</td>
                        <td>{$vo.gonghao}</td>
                        <td>{$vo.tel}</td>
                        <td>
                            {if condition="$vo['openid'] eq ''"}
                            {if condition="checkPath('personnel/cashierbinding')"}
                            <a href="javascript:void(0);" data-id="{$vo.id}" data-uid="{$vo.id}"
                               class="bangding btn-link">去绑定</a>
                            {/if}
                            {else /}
                            <div style="overflow: hidden;display: inline-block;">
                                <img src="{$vo.headimg}" class="pull-left" alt="头像"
                                     style="width:48px;height:48px;margin-right: 10px;">
                                <div class="pull-left text-left">
                                    <div class="ellipsis" style="max-width: 6em;line-height: 20px;"> {$vo.nickname}
                                    </div>
                                    {if condition="checkPath('personnel/cashierunbin')"}
                                    <a href="javascript:;" data-id="{$vo.id}" class="delbang btn-link text-left">解除</a>
                                    |
                                    {/if}
                                    {if condition="checkPath('personnel/per_machlist')"}
                                    <a href="javascript:;" data-id="{$vo.id}" data-openid="{$vo.openid}"
                                       data-toggle="modal" data-target="#wechat" class="btn-link text-left">微信消息通知</a>
                                    {/if}
                                    {if condition="checkPath('personnel/offreport')"}
                                    <br/>
                                    <a href="{:url('personnel/offreport',['id'=>$vo['id'],'report'=>$vo['is_report']])}"
                                       class=" btn-link text-left">
                                        经营日报推送{eq name="vo.is_report" value="0"}已关闭{else/}已开启{/eq}
                                    </a>
                                    {/if}

                                </div>
                            </div>
                            {/if}
                        </td>
                        <td>{:getuserlevel($vo.level)}</td>
                        <td><a href="javascript:;" class="btn-link" onclick="machid(this);"
                               data-mid="{:getmachname($vo.mid)}">查看</a></td>
                        <td>
                            <a href="javascript:;" class="btn-link" onclick="show('{$vo.username}');">重置密码</a>&nbsp;&nbsp;|

                            {if condition="checkPath('personnel/cashieredit')"}
                            <a style="display: inline-block;" class=" btn-link"
                               href="{:url('Personnel/cashieredit',['id'=>$vo['id']])}">修改</a>
                            {/if}
                            {if condition="checkPath('personnel/cashierdel')"}
                            <a style="display: inline-block;" href="javascript:;" class=" btn-link del"
                               data-id="{$vo.id}">删除</a>
                            {/if}
                        </td>
                    </tr>

                    {/volist}
                    </tbody>
                </table>
            </div>
            <!--分页-->
        </div>
        {include file='public/footer'/}
    </div>
</section>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    微信绑定
                </h4>
            </div>
            <div class="modal-body">
                <form id="bangding_frm">
                    <input type="hidden" name="id" value="" id="cashier_id">
                    <div class="form-horizontal ng-pristine ng-invalid ng-invalid-required"
                         style="">
                        <div class="row">
                            <div class="col-xs-4">
                                <!--姓名-->
                                <div class="form-group">
                                    <label class="col-sm-6 control-label" for="">姓名：</label>
                                    <div class="col-sm-6">
                                        <label class="control-label xingming"></label>
                                    </div>
                                </div>

                                <!--工号-->
                                <div class="form-group">
                                    <label class="col-sm-6 control-label" for="">工号：</label>
                                    <div class="col-sm-6">
                                        <label class="control-label gonghao"></label>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-4">
                                <div class="form-group">
                                    <div class="col-sm-12">
                                        <div class="r-desc">
                                            <div class="ng-isolate-scope" id="saomiao"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-xs-4">
                                <div class="form-group">
                                    <label class="col-sm-4 control-label" for="">头像：</label>
                                    <div class="col-sm-8">
                                        <img id="headimg" ng-src="" style="width:100px; height:100px;">
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!--员工姓名-->
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="">昵称：</label>
                            <div class="col-sm-10">
                                <input type="hidden" id="bind-uid" name="uid">
                                <input type="hidden" id="headimgs" name="headimg">
                                <input type="text" id="nickname"
                                       class="form-control"
                                       autocomplete="off" ng-model="model.nickname" placeholder="等待员工扫码获取"
                                       name="nickname" readonly="">
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="">openid：</label>
                            <div class="col-sm-10">
                                <input type="text" id="openid"
                                       class="form-control ng-pristine ng-untouched ng-empty ng-invalid ng-invalid-required"
                                       autocomplete="off" ng-model="model.openid" placeholder="等待员工扫码获取" name="openid"
                                       readonly="" ng-required="true" required="required">
                                <div class="text-danger ng-inactive"
                                     ng-messages="forms.default.openid.$dirty &amp;&amp; forms.default.openid.$error"
                                     style="">
                                    <!-- ngMessage: required -->
                                </div>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="">验证码(选填)：</label>
                            <div class="col-sm-10">
                                <div class="input-group">
                                    <input type="text" class="form-control ng-pristine ng-untouched ng-valid ng-empty"
                                           autocomplete="off" placeholder="当员工扫码后未自动获取,请使用验证码拉取信息">
                                    <span class="btn btn-default input-group-addon" ng-click="pullInfo()">拉取信息</span>
                                </div>
                            </div>
                        </div>

                    </div>

                </form>

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭
                </button>
                <button type="button" class="btn btn-primary" id="binduser">
                    确认绑定
                </button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


<!-- 微信消息通知Modal -->
<div class="modal fade" id="wechat" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="wechatLabel" style="font-size: 14px;">微信消息通知</h4>
            </div>
            <div class="modal-body">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h5>微信消息通知开关</h5>
                    </div>
                    <div class="panel-body">
                        <ul class="list-group" id="list-group">

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- 是否重置该代理商密码（Modal） -->
<div class="modal fade" id="myModal3" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

            </div>
            <div class="modal-body"><h4 class="modal-title" id="myModalLabel3">是否重置该用户密码</h4></div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">否</button>
                <button type="button" class="btn btn-primary" id="btn-primary" data-id="">是</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>
<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>

            </div>
            <div class="modal-body">

                <div class="form-group" style="    height: 33px;">
                    <label for="password" class="col-sm-2 control-label" style="margin-top: 9px;">账号</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="name" name="name" placeholder="请输入账号" value=""
                               disabled>
                    </div>
                    <div class="col-sm-2" style="    margin-top: 5px;">
                        <a href="javascript:;" id="cname" data-clipboard-action="copy"
                           data-clipboard-text=""
                           class="copytext">点击复制</a>
                    </div>
                </div>
                <div class="form-group" style="  height: 33px;">
                    <label for="password" class="col-sm-2 control-label" style="margin-top: 9px;">密码</label>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" id="password" name="password" placeholder="请输入密码"
                               value="" disabled>
                    </div>
                    <div class="col-sm-2" style="margin-top: 5px;">
                        <a href="javascript:;" id="cword" data-clipboard-action="copy" data-clipboard-text=""
                           class="copytext">点击复制</a></div>
                </div>
                <div class="checkboxs">
                    <label><input type="checkbox" value="" name="pname" id="pname">我已保存该账号密码</label>
                </div>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
                <button type="button" class="btn btn-primary" id="btn-default">提交更改</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

<!-- 微信消息通知Modal -->
<div class="modal fade" id="modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="modal-title" style="font-size: 14px;">所属门店</h4>
            </div>
            <div class="modal-body">
                <div class="panel panel-default">
                    <div class="panel-heading">
                        <h5>所属门店</h5>
                    </div>
                    <div class="panel-body" id="mch">

                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    function machid(obj) {
        $("#mch").html();
        var val = $(obj).attr("data-mid");
        $("#mch").html(val);
        $('#modal').modal('show')
    }
</script>
<script>
    function show(name) {
        $('#btn-primary').attr("data-id", name);
        $('#myModal3').modal('show')
    }

    $("#btn-primary").click(function () {
        $('#myModal3').modal('hide')
        $('#myModal1').modal('show')
        var username = $('#btn-primary').attr("data-id");
        $.ajax({
            url: "{:url('personnel/resetpassword')}",
            type: 'POST',
            data: {
                username: username
            },
            success: function (data) {
                //console.log(data);
                $("#pname").attr('checked',false)
                $('#name').val(data.username);
                $('#cname').attr("data-clipboard-text", data.username);
                $('#password').val(data.new_password);

                $('#cword').attr("data-clipboard-text", data.new_password);
            }
        })
    });
    $("#btn-default").click(function () {
        var aaa = $("#pname").get(0).checked;
        // console.log(aaa);
        if (aaa == true) {
            $('#myModal1').modal('hide')
        } else if (aaa == false) {
            alert("请选中我已保存");
        }
        ;


    })

</script>

<script src="__STATIC_URL__/static/js/clipboard.min.js"></script>
<script>
    // $(function () {

    var clipboard = new Clipboard('.copytext');

    clipboard.on('success', function (e) {
        layer.msg('复制成功');
    });

    clipboard.on('error', function (e) {
        layer.msg('复制失败');
    });
    // })
</script>
<script src="__STATIC_URL__/static/js/template.js"></script>
<script id="modallist" type="text/html">
    {{each list value i}}
    <li class="list-group-item">
        <form action="">
            <div class="pull-right">
                <input type="hidden" name="is_tz" value="{{list[i].is_tz.is_tz}}">
                <input type="hidden" name="openid" value="{{openid}}">
                <input type="hidden" name="mid" value="{{list[i].id}}">
                <input type="checkbox" class="create-switch" {{ if (list[i].is_tz.is_tz=="1" )}} checked {{/if}}/>
            </div>
        </form>
        <span>{{list[i].merchant}}</span>
    </li>
    {{/each}}
</script>
</body>
<script src="__STATIC_URL__/static/js/qrcode/qrcode.js"></script>
<script src="__STATIC_URL__/static/layer/layer.js"></script>
<script type="text/javascript">
    var myVar;
    $(function () {
//        获取微信通知列表
        $('#wechat').on('show.bs.modal', function () {
            var qxx = "{:checkPath('personnel/per_machlist')}";
            if (qxx == 0) {
                layer.alert("没有权限");
                return false;
            }
            var openid = $(event.target).data("openid");
            var datas = {};
            $.ajax({
                url: "{:url('personnel/per_machlist')}",
                type: "post",
                data: {
                    openid: openid
                },
                success: function (data) {
//                   定义返回的数据为一个json
                    datas.list = data;
                    datas.openid = openid;
                    var html = template('modallist', datas);
                    $("#list-group").html(html);
//                    初始化开关按钮
                    $('.create-switch').wrap('<div class="switch switch-small" data-on-label="开" data-off-label="关"/>').parent().bootstrapSwitch();
//                    判断是否有权限设置通知状态
                    var qx = "{:checkPath('personnel/add_cashier')}";
                    if (qx == 0) {
                        $('.switch').bootstrapSwitch('setActive', false);
                        return false;
                    }
//                    通知按钮开关切换
                    $('.switch').on('switch-change', function (e, data) {
                        var $el = $(data.el), value = data.value;
                        var elm = $el.parentsUntil("form").find("input[name='is_tz']");
                        if (value == true) {
                            elm.val("1");
                        } else if (value == false) {
                            elm.val("0");
                        }
                        var datas = $el.parent().parent().parent().parent().serialize();
                        $.ajax({
                            url: "{:url('personnel/add_cashier')}",
                            type: "post",
                            data: datas,
                            success: function (data) {
                                if (data.code == 0) {
                                    layer.msg("设置成功", {icon: 1, time: 1000});
                                    return false;
                                } else {
                                    layer.alert(data.message, {icon: 7});
                                    return false;
                                }
                            }
                        })
                    });
                }
            })
        });
//        删除员工方法
        $(".del").click(function () {
            var id = $(this).attr("data-id");
            //询问框
            layer.confirm('确认删除该员工吗？', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: "{:url('personnel/cashierdel')}",
                    type: "post",
                    async: true,
                    data: {
                        id: id
                    },
                    success: function (data) {
                        if (data.code == 0) {
                            layer.msg("删除成功", {time: 500, icon: 1});
                            setTimeout("window.location.reload()", 500);
                            return false;
                        } else {
                            layer.alert(data.message, {icon: 7});
                            return false;
                        }
                    }
                })
            }, function () {
            });
        });
        //        员工解绑操作方法
        $(".delbang").click(function () {
            var id = $(this).attr("data-id");
            //询问框
            layer.confirm('确认对该员工进行解绑操作吗？', {
                btn: ['确认', '取消'] //按钮
            }, function () {
                $.ajax({
                    url: "{:url('personnel/cashierunbin')}",
                    type: "post",
                    async: true,
                    data: {
                        id: id
                    },
                    success: function (data) {
                        if (data.code == 0) {
                            layer.msg(data.message, {time: 500, icon: 1});
                            setTimeout("window.location.reload()", 500);
                            return false;
                        } else {
                            layer.alert(data.message, {icon: 7});
                            return false;
                        }
                    }
                })
            }, function () {
            });
        });
//        监听模态框关闭 清空扫描二维码
        $("#myModal").on('hide.bs.modal', function () {
            clearInterval(myVar);
            $("#saomiao").html('');
        });
        $("#binduser").click(function () {

            $.ajax({
                url: "{:url('personnel/cashierbinding')}",
                type: "post",
                async: "true",
                data: $("#bangding_frm").serialize(),
                success: function (data) {
                    // console.log(data);
                    if (data.code == 0) {
                        layer.msg(data.message);
                        $("#myModal").modal("hide");
                        setTimeout("window.location.reload()", 500)
                        return false;
                    } else {
                        layer.alert(data.message);
                    }
                }
            })
        });

    });
</script>
<script>


    $('.bangding').click(function () {
        var imgurl="__STATIC_URL__/static/img/wei.png"
        $('#openid').val("");
        $('#headimg').attr("src",imgurl);
        $("#headimgs").val("");
        $('#nickname').val("");
        var cashier = $(this).attr('data-id');
        var uid = $(this).attr("data-uid");
        $.ajax({
            type: 'post',
            url: "{:url('Personnel/getcashier_info')}",
            data: {
                id: cashier,
            },
            success: function (data) {
                new QRCode($(".ng-isolate-scope")[0], {
                    text: data.login_url,
                    width: 100,
                    height: 100,
                    colorDark: '#000000',
                    colorLight: '#ffffff',
                    correctLevel: QRCode.CorrectLevel.L
                });
                $('#cashier_id').val(cashier);
                $("#bind-uid").val(uid);
                $('.xingming').text(data.xingming);
                $('.gonghao').text(data.gonghao);
                $('#myModal').modal('show');
                myVar = setInterval(function () {
                    $.ajax({
                        type: 'post',
                        url: "{:url('personneltest/chackcashier')}",
                        data: {
                            scode: data.code,
                        },
                        success: function (data) {
                            // console.log(123,data);
                            if (data.code == 0) {
                                clearInterval(myVar);
                                $('#openid').val(data.data.openid);
                                $('#headimg').attr('src', data.data.headimgurl);
                                $("#headimgs").val(data.data.headimgurl);
                                $('#nickname').val(data.data.nickname);

                            }else{
                                $('#openid').val("");
                                $('#headimg').attr("src",imgurl);
                                $("#headimgs").val("");
                                $('#nickname').val("");
                            }
                        }
                    })


                }, 3000);
            }
        })
    });

</script>
<script type="text/javascript">


</script>

</body>
</html>